<!DOCTYPE html>
<html class="x-admin-sm">
    
    <head>
        <meta charset="UTF-8">
        <title>欢迎页面-X-admin2.2</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" href="./css/font.css">
        <link rel="stylesheet" href="./css/xadmin.css">
        <script src="./lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="./js/xadmin.js"></script>
        <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
    </head>
    <style>
    	.layui-table-cell{
    height:80px;
    line-height:50px;
}
    </style>
    <body>
        <div class="x-nav">
            <span class="layui-breadcrumb">
                <a href="">首页</a>
                <a href="">演示</a>
                <a>
                    <cite>导航元素</cite></a>
            </span>
            <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
                <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
            </a>
        </div>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-body ">
                            <form class="layui-form layui-col-space5">
                                <div class="layui-input-inline layui-show-xs-block">
                                     <input type="text" name="doctor_name" placeholder="请输入医生名字" autocomplete="off" class="layui-input"></div>
                                <div class="layui-input-inline layui-show-xs-block">
                                     <input type="text" name="user_name" placeholder="请输入病人名字" autocomplete="off" class="layui-input"></div>
                                <div class="layui-input-inline layui-show-xs-block">
                                    <select name="orderStatus">
                                        <option value="">订单状态</option>
                                        <option value="0">未就诊</option>
                                        <option value="1">已就诊</option>
                                        <option value="2">已取消</option>
                                        <option value="3">已过期</option>
                                    </select>
                                </div>
                                 <div class="layui-input-inline layui-show-xs-block">
                                    <select name="way">
                                        <option value="">订单状态</option>
                                        <option value="0">微信端</option>
                                        <option value="1">PC端</option>
                                    </select>
                                </div>
                                <div class="layui-input-inline layui-show-xs-block">
                                    <input type="text" name="card" placeholder="请输入病人门诊卡号" autocomplete="off" class="layui-input"></div>
                                <div class="layui-input-inline layui-show-xs-block">
                                    <input type="text" name="order_id" placeholder="请输入订单编号" autocomplete="off" class="layui-input"></div>
                                <div class="layui-input-inline layui-show-xs-block">
                                    <button class="layui-btn" lay-submit="" lay-filter="sreach">
                                        <i class="layui-icon">&#xe615;</i></button>
                                </div>
                            </form>
                        </div>
                        <div class="layui-card-header">
                            <button class="layui-btn layui-btn-danger" onclick="delAll()">
                                <i class="layui-icon"></i>批量删除</button>
                                 <button class="layui-btn" onclick="xadmin.open('添加用户','./doctor-add.html',800,600)">
                                <i class="layui-icon"></i>添加</button></div>
                        <div class="layui-card-body ">
                        	<table id="demo" lay-filter="test" ></table>
                        </div>
                        <div class="layui-card-body ">
                            <!--<div class="page">
                                <div>
                                    <a class="prev" href="">&lt;&lt;</a>
                                    <a class="num" href="">1</a>
                                    <span class="current">2</span>
                                    <a class="num" href="">3</a>
                                    <a class="num" href="">489</a>
                                    <a class="next" href="">&gt;&gt;</a></div>
                            </div>-->
                        </div>
                    </div>
                </div>
            </div>
        </div>
		<script id="btf">
			<a title="查看" onclick="xadmin.open('编辑','admin-edit.html')" href="javascript:;">
				<i class="layui-icon">&#xe63c;</i></a>
			<a title="删除" onclick="member_del(this,'this.doctorId')" href="javascript:;">
				<i class="layui-icon">&#xe640;</i></a>
		</script>
		<script type="text/html" id="barOption">
		    <a class="layui-btn layui-btn-mini" lay-event="detail">查看</a>
		    <a class="layui-btn layui-btn-mini layui-btn-normal" lay-event="edit">编辑</a>
		    <a class="layui-btn layui-btn-mini layui-btn-danger" lay-event="del">删除</a>
		</script>
		<script id="selectAll">
			<input type="checkbox" name="" lay-skin="primary"/>
		</script>
		<script id="selectOne">
			<input type="checkbox" name="" lay-skin="primary"/>
		</script>
    </body>
    <script>
    	$.ajaxSetup({
                xhrFields: {
                    withCredentials: true
                },

            });
    	layui.use('table', function(){
  var table = layui.table;
  
  //第一个实例
  table.render({
    elem: '#demo'
    ,height: 500
    ,url: 'http://api.hospital.com/api/order/allOrder' //数据接口
    ,method:"post"
    ,page: true //开启分页
    ,request: {
	    pageName: 'pages' //页码的参数名称，默认：page
	    ,limitName: 'rows' //每页数据量的参数名，默认：limit
	  }
    ,parseData: function(res){ //res 即为原始返回的数据
    return {
      "code": res.code, //解析接口状态
      "msg": res.message, //解析提示文本
      "count": res.content.total, //解析数据长度
      "data": res.content.items //解析数据列表
    };
  }
    ,cols: [[ //表头
    {type:'checkbox', fixed: 'left'},
      ,{field: 'orderId', title: '订单编号', width:155, sort: true}
      ,{field: 'doctorName', title: '医生姓名', width:80}
      ,{field: 'userName', title: '病人姓名', width:80}
      ,{field: 'registerTime', title: '预约时段', width:177} 
      ,{field: 'outpatientName', title: '门诊名称', width: 80}
      ,{field: 'orderStatus', title: '订单状态', width: 80
      ,templet: function(d){
      	if(d.orderStatus==0){
      		return '未就诊'
      	}else if(d.orderStatus==1){
      		return '已就诊'
      	}else if(d.orderStatus==2){
      		return '已取消'
      	}else if(d.orderStatus==3){
      		return '已过期'
      	}
      }}
      ,{field: 'insertUserId', title: '提交订单人ID号', width: 150}
      ,{field: 'diagnosis', title: '诊断结果', width: 80}
      ,{field: 'way', title: '预约途径', width: 80
      ,templet: function(d){
      	if(d.way==0){
      		return '微信端'
      	}else if(d.way==1){
      		return 'PC端'
      	}
      }}
      ,{field: 'fare', title: '预约费用', width: 135, sort: true}
      ,{field: 'orderTime', title: '提交订单时间', width: 180, sort: true}
      ,{title: '操作', width: 250, toolbar: '#barOption'}
    ]],
    done: function(res, curr, count){
		//如果是异步请求数据方式，res即为你接口返回的信息。
		//如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
		console.log(res);
		//得到当前页码
		console.log(curr);
		//得到数据总量
		console.log(count);
		if (res.data.length == 0&&curr>1) {
			table.reload('demo',{page:{curr:curr-1}});
		}
	}
  });
  
});
    	layui.use(['laydate', 'form'],
        function() {
            var laydate = layui.laydate;

            //执行一个laydate实例
            laydate.render({
                elem: '#start' //指定元素
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#end' //指定元素
            });
        });

        /*用户-停用*/
        function member_stop(obj, id) {
            layer.confirm('确认要停用吗？',
            function(index) {

                if ($(obj).attr('title') == '启用') {

                    //发异步把用户状态进行更改
                    $(obj).attr('title', '停用');
                    $(obj).find('i').html('&#xe62f;');

                    $(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
                    layer.msg('已停用!', {
                        icon: 5,
                        time: 1000
                    });

                } else {
                    $(obj).attr('title', '启用');
                    $(obj).find('i').html('&#xe601;');

                    $(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
                    layer.msg('已启用!', {
                        icon: 5,
                        time: 1000
                    });
                }

            });
        }

        /*用户-删除*/
        function member_del(obj, id) {
        	console.log(obj);
            layer.confirm('确认要删除吗？',
            function(index) {
                //发异步删除数据
                $.ajax({
                	type:"get",
					url:"http://api.hospital.com/api/order/delSelectOrder",
					async:true,
					data:{
						ids:ids
					},
					success:function(e){
						console.log(e);
						$(obj).parents("tr").remove();
		                layer.msg('已删除!', {
		                    icon: 1,
		                    time: 1000
		                });
	               }
                })
                
            });
        }
 		  
        function delAll(argument) {
						
			var data = layui.table.checkStatus('demo').data;
			console.log(data);
			var ids = data.map(item=>item.orderId);
			console.log(ids);
            layer.confirm('确认要删除吗？',
            function(index) {
                //捉到所有被选中的，发异步进行删除
                $.ajax({
                	type:"POST",
					url:"http://api.hospital.com/api/order/delSelect",
					async:true,
					 headers: {
				        'Content-Type': 'application/x-www-form-urlencoded'
				    },
					data:{
						ids:ids
					},
					success:function(e){
						console.log(e);
						layer.msg('删除成功', {
	                    icon: 1
	                	});
	                $(".layui-form-checked").not('.header').parents('tr').remove();
	                layui.table.reload('demo');    
	               }
                })
                
            });
        }
        
		layui.use(['form','table'], function() {
			var form = layui.form;
			var table = layui.table;
			//监听提交
			form.on('submit(sreach)', function(data) {
				 //执行重载
				 console.log(data.field.doctorName);
            table.reload('demo', {
                page: {
                    curr: 1 //重新从第 1 页开始
                }
                , where: data.field
                , url:"http://api.hospital.com/api/order/allOrder"//后台做模糊搜索接口路径
                , method: 'post'
                ,parseData: function(res){ //res 即为原始返回的数据
				    return {
				      "code": res.code, //解析接口状态
				      "msg": res.message, //解析提示文本
				      "count": res.content.total, //解析数据长度
				      "data": res.content.items //解析数据列表
				    }}
            });
            
            return false;//false：阻止表单跳转  true：表单跳转
//				layer.msg(JSON.stringify(data.field));
//				$.ajax({
//					type:"get",
//					url:"http://api.hospital.com/api/doctor/allDoctor",
//					async:true,
//					data:{
//						doctorName:data.field.doctorName,
//						outpatientName:data.field.outpatientName,
//						position:data.field.position,
//						doctorNumber:data.field.doctorNumber
//					},
//					success:function(e){
//						console.log(e);
//					}
//				});
//				return false;
			});
			
			table.on('tool(test)', function (obj) {
			console.log(obj);
            var data = obj.data;
            if (obj.event === 'detail') {
                layer.msg('ID：' + data.doctorId + ' 的查看操作');
            } else if (obj.event === 'del') {
                layer.confirm('真的删除行么', function (index) {
                    $.ajax({
                        url: "http://api.hospital.com/api/order/delete/"+obj.data.orderId,
                        type: "DELETE",
                        success: function (res) {
                                //删除这一行
                                obj.del();
                                //关闭弹框
                                layer.close(index);
                                layer.msg("删除成功", {icon: 6});
                                layui.table.reload('demo');  
                                
                        },error:function(res){
                        	layer.msg("删除失败", {icon: 5});
                        }
                    });
                    return false;
                });
            } else if (obj.event === 'edit') {
                layer.open({
                    type: 2,
                    title: '采集设备添加',
                    maxmin: true,
                    area: ['800px', '800px'],
                    shadeClose: false, //点击遮罩关闭
                    content: 'order-update.html?'+obj.data.orderId,
                });
//              update(data)
            }
        });
		});

    </script>

</html>